html,
body,
#app {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
}
body {
  font-family:
    system-ui,
    BlinkMacSystemFont,
    Segoe UI,
    Roboto,
    Helvetica Neue,
    Arial,
    Noto Sans,
    Liberation Sans,
    sans-serif,
    Apple Color Emoji,
    Segoe UI Emoji,
    Segoe UI Symbol,
    Noto Color Emoji;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #212529;
  text-align: left;
  background-color: #fff;
}

html {
  touch-action: none;
  font-family: sans-serif;
  line-height: 1.15;
  -webkit-text-size-adjust: 100%;
  -webkit-tap-highlight-color: transparent;
}

html * {
  touch-action: auto;
}
*,
::after,
::before {
  box-sizing: border-box;
}

:root {
  --text: #000;
  --text2: #444;
  --bg: #ffffff;
  --bg50: #ffffff80;
  --bg70: #ffffffa0;
  --sd: #22222230;
  --card: #efefef55;
  --hover: #ffffff65;
  --hover-half: #ffffff40;
  --hover-b: #1111110f;
  --bggrey: #ddd;
  --fill: #d3d3d370;
  --bgul: url('bg.svg');
  --mm: #ffffffc0;
  --cm: #fafafabb;
  --bar: #efefef37;
  --hr: #ccc;
  --unfoc: #eaeaea;
  --msg: #ffffffe7;
  --theme-1: #ad6eca;
  --theme-2: #3b91d8;
  --href: #2983cc;
  --bd: #8f8f8f30;
  --s3d: #99999947;
  --mica: linear-gradient(215deg, #ffe7f6, #a9c3ff);
}

:root.dark {
  --text: #ddd;
  --text2: #aaa;
  --bg: #000000;
  --bg50: #00000060;
  --bg70: #00000090;
  --sd: #000000a0;
  --card: #72727240;
  --hover: #aaaaaa15;
  --hover-half: #ffffff0a;
  --hover-b: #eeeeee0f;
  --bggrey: #444;
  --fill: #54545470;
  --bgul: url('bg-dark.svg');
  --mm: #ffffff50;
  --cm: #252525bb;
  --bar: #7272722a;
  --hr: #333;
  --unfoc: #202020;
  --msg: #303030d0;
  --bd: #ffffff06;
  --s3d: #11111150;
  --mica: linear-gradient(215deg, #2d161c, #102d53);
}
